// these are menus (i.e. dropdown menus) that are
// drawn on a separate layer so it's not cut off
// by containers higher up in the hierarchy

.menu-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: $zindex-menu-layer;

  > * {
    pointer-events: initial;
  }
}

.modal-container .menu-layer {
  z-index: $zindex-modal + 5;
}
